"use strict";
var Cropper = require("cropperjs");
var Locale = require("element-ui/lib/mixins/locale");
var CropperTools = require("./components/cropper-tools");
var license = require("../utils/license");
function _interopDefaultLegacy(e) {
  return e && typeof e === "object" && "default" in e ? e : { "default": e };
}
var Cropper__default = /* @__PURE__ */ _interopDefaultLegacy(Cropper);
var Locale__default = /* @__PURE__ */ _interopDefaultLegacy(Locale);
var CropperTools__default = /* @__PURE__ */ _interopDefaultLegacy(CropperTools);
var render = function() {
  var _vm = this;
  var _h = _vm.$createElement;
  var _c = _vm._self._c || _h;
  return _c("div", { staticClass: "ele-cropper" }, [_c("div", { staticClass: "ele-cropper-group" }, [_c("div", { staticClass: "ele-cropper-img-group" }, [_c("img", { ref: "imageEl", style: { maxWidth: "100%", display: _vm.src ? "block" : "none" }, attrs: { "src": _vm.src, "alt": "cropper" } })]), _vm.showPreview ? _c("div", { ref: "previewEl", staticClass: "ele-cropper-preview-group", style: { width: _vm.previewWidth + 20 + "px" } }, [_c("div", { staticClass: "ele-cropper-preview", style: {
    width: _vm.previewWidth + "px",
    height: _vm.previewWidth / (_vm.aspectRatio || 1) + "px"
  } }), _vm.aspectRatio === 1 ? _c("div", { staticClass: "ele-cropper-preview ele-cropper-preview-circle", style: {
    width: _vm.previewWidth + "px",
    height: _vm.previewWidth / (_vm.aspectRatio || 1) + "px"
  } }) : [_c("div", { staticClass: "ele-cropper-preview", style: {
    width: _vm.previewWidth + "px",
    height: (_vm.previewWidth / 3 * 2 - 10) / (_vm.aspectRatio || 1) + "px"
  } }), _c("div", { staticClass: "ele-cropper-preview", style: {
    width: _vm.previewWidth + "px",
    height: _vm.previewWidth / 3 / (_vm.aspectRatio || 1) + "px",
    marginLeft: "10px"
  } })]], 2) : _vm._e()]), _c("CropperTools", { attrs: { "tools": _vm.tools, "ok-text": _vm.okText }, on: { "crop": _vm.crop, "move-b": _vm.moveB, "move-l": _vm.moveL, "move-r": _vm.moveR, "move-t": _vm.moveT, "reset": _vm.reset, "rotate-l": _vm.rotateL, "rotate-r": _vm.rotateR, "scale-x": _vm.scaleX, "scale-y": _vm.scaleY, "replace": _vm.replace, "zoom-in": _vm.zoomIn, "zoom-out": _vm.zoomOut } })], 1);
};
var staticRenderFns = [];
function normalizeComponent(scriptExports, render2, staticRenderFns2, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
  var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
  if (render2) {
    options.render = render2;
    options.staticRenderFns = staticRenderFns2;
    options._compiled = true;
  }
  if (functionalTemplate) {
    options.functional = true;
  }
  if (scopeId) {
    options._scopeId = "data-v-" + scopeId;
  }
  var hook;
  if (moduleIdentifier) {
    hook = function(context) {
      context = context || this.$vnode && this.$vnode.ssrContext || this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext;
      if (!context && typeof __VUE_SSR_CONTEXT__ !== "undefined") {
        context = __VUE_SSR_CONTEXT__;
      }
      if (injectStyles) {
        injectStyles.call(this, context);
      }
      if (context && context._registeredComponents) {
        context._registeredComponents.add(moduleIdentifier);
      }
    };
    options._ssrRegister = hook;
  } else if (injectStyles) {
    hook = shadowMode ? function() {
      injectStyles.call(this, (options.functional ? this.parent : this).$root.$options.shadowRoot);
    } : injectStyles;
  }
  if (hook) {
    if (options.functional) {
      options._injectStyles = hook;
      var originalRender = options.render;
      options.render = function renderWithStyleInjection(h, context) {
        hook.call(context);
        return originalRender(h, context);
      };
    } else {
      var existing = options.beforeCreate;
      options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
    }
  }
  return {
    exports: scriptExports,
    options
  };
}
const __vue2_script = {
  name: "EleCropper",
  components: { CropperTools: CropperTools__default["default"] },
  mixins: [Locale__default["default"]],
  props: {
    src: String,
    aspectRatio: {
      type: Number,
      default: 1
    },
    viewMode: {
      type: Number,
      default: 0
    },
    dragMode: {
      type: String,
      default: "crop"
    },
    initialAspectRatio: Number,
    minContainerWidth: {
      type: Number,
      default: 200
    },
    minContainerHeight: {
      type: Number,
      default: 100
    },
    minCanvasWidth: {
      type: Number,
      default: 0
    },
    minCanvasHeight: {
      type: Number,
      default: 0
    },
    minCropBoxWidth: {
      type: Number,
      default: 0
    },
    minCropBoxHeight: {
      type: Number,
      default: 0
    },
    croppedWidth: Number,
    croppedHeight: Number,
    croppedMinWidth: {
      type: Number,
      default: 0
    },
    croppedMinHeight: {
      type: Number,
      default: 0
    },
    croppedMaxWidth: Number,
    croppedMaxHeight: Number,
    croppedFillColor: {
      type: String,
      default: "transparent"
    },
    imageSmoothingEnabled: Boolean,
    imageSmoothingQuality: String,
    toBlob: Boolean,
    accept: String,
    tools: String,
    showPreview: {
      type: Boolean,
      default: true
    },
    okText: String,
    previewWidth: {
      type: Number,
      default: 120
    }
  },
  emits: ["crop"],
  data() {
    return {
      authenticated: license.checkLicense(),
      ins: null,
      imgType: "image/jpeg",
      scaleXValue: -1,
      scaleYValue: -1
    };
  },
  mounted() {
    if (this.src) {
      this.render();
    }
  },
  methods: {
    render() {
      var _a;
      if (!this.authenticated) {
        return;
      }
      this.destroy();
      const options = {
        aspectRatio: this.aspectRatio,
        viewMode: this.viewMode,
        dragMode: this.dragMode,
        initialAspectRatio: this.initialAspectRatio,
        minContainerWidth: this.minContainerWidth,
        minContainerHeight: this.minContainerHeight,
        minCanvasWidth: this.minCanvasWidth,
        minCanvasHeight: this.minCanvasHeight,
        minCropBoxWidth: this.minCropBoxWidth,
        minCropBoxHeight: this.minCropBoxHeight
      };
      if (this.showPreview) {
        options.preview = (_a = this.$refs.previewEl) == null ? void 0 : _a.querySelectorAll(".ele-cropper-preview");
      }
      this.ins = new Cropper__default["default"](this.$refs.imageEl, options);
    },
    zoomIn() {
      this.ins && this.ins.zoom(0.1);
    },
    zoomOut() {
      this.ins && this.ins.zoom(-0.1);
    },
    moveL() {
      this.ins && this.ins.move(-10, 0);
    },
    moveR() {
      this.ins && this.ins.move(10, 0);
    },
    moveT() {
      this.ins && this.ins.move(0, -10);
    },
    moveB() {
      this.ins && this.ins.move(0, 10);
    },
    rotateL() {
      this.ins && this.ins.rotate(-45);
    },
    rotateR() {
      this.ins && this.ins.rotate(45);
    },
    scaleX() {
      this.ins && this.ins.scaleX(this.scaleXValue);
      this.scaleXValue = -this.scaleXValue;
    },
    scaleY() {
      this.ins && this.ins.scaleY(this.scaleYValue);
      this.scaleYValue = -this.scaleYValue;
    },
    reset() {
      this.ins && this.ins.reset();
    },
    crop() {
      var _a;
      const result = (_a = this.ins) == null ? void 0 : _a.getCroppedCanvas({
        width: this.croppedWidth,
        height: this.croppedHeight,
        minWidth: this.croppedMinWidth,
        minHeight: this.croppedMinHeight,
        maxWidth: this.croppedMaxWidth,
        maxHeight: this.croppedMaxHeight,
        fillColor: this.croppedFillColor,
        imageSmoothingEnabled: this.imageSmoothingEnabled,
        imageSmoothingQuality: this.imageSmoothingQuality
      });
      if (result) {
        if (this.toBlob) {
          result.toBlob((blob) => {
            this.$emit("crop", blob);
          }, this.imgType);
        } else {
          this.$emit("crop", result.toDataURL(this.imgType));
        }
      } else {
        this.$emit("crop");
      }
    },
    replace({ data, type }) {
      this.imgType = type;
      if (this.ins) {
        this.ins.replace(data);
      } else {
        const elem = this.$refs.imageEl;
        if (elem) {
          elem.src = data;
          elem.style.display = "block";
        }
        this.render();
      }
    },
    destroy() {
      this.ins && this.ins.destroy();
      this.ins = null;
    }
  },
  watch: {
    src(value) {
      if (value) {
        if (this.ins) {
          this.ins.replace(value);
        } else {
          this.$nextTick(() => {
            this.render();
          });
        }
      } else {
        this.destroy();
      }
    }
  },
  unmounted() {
    this.destroy();
  }
};
const __cssModules = {};
var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, render, staticRenderFns, false, __vue2_injectStyles, null, null, null);
function __vue2_injectStyles(context) {
  for (let o in __cssModules) {
    this[o] = __cssModules[o];
  }
}
var index = /* @__PURE__ */ function() {
  return __component__.exports;
}();
module.exports = index;
